<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        function fn(a,b) {
            console.log("外面:",this,a,b);
            setTimeout(() => {
                console.log(this)//箭头函数没有自己的this,沿着作用域链的形式往外找
            }, 20)
        }
        /* 
            调用这个fn这个函数
            强制改变this的指向 => Number
                call,apply,bind
                    共同的特点 => 他们的第一个参数都是this的指向
                区别:
                    call,apply  => 传参的时候,call的参数是从第二个参数开始传过去,apply传参的时候,是以数组的形式进行传参
                    call,bind   => call可以调用这个函数,bind不可以调用这个函数
        */
        // fn.call(1,2,3)
        // fn.bind(1,2,3)()
        fn.apply(1,[2,3]);

        // let a = 20;
        // function fn1(){
        //     function fn2(){
        //         let a = 30;
        //         function fn3(){
        //             console.log(a);//a is not defined
        //         }
        //         fn3();
        //     }
        //     fn2();
        // }
        // fn1();
    </script>
</body>

</html>